<template>
  <!-- 添加或修改客户运营 -->
  <div class="app-container">
    <div style="background-color: #fff;">
      <div style="height: 7px;">

      </div>
      <div class="div-title">
        <span>基础信息</span>
      </div>
      <el-form ref="form" :model="form" :rules="rules" label-width="200px" label-position="right">

        <el-form-item label="计划名称：" prop="operationName">
          <el-input v-model="form.operationName" v-if="updateStatus == 'add' " class="select-normal" placeholder="请输入计划名称" clearable></el-input>
          <el-input v-model="form.operationName" v-if="updateStatus == 'edit' " disabled class="select-normal" placeholder="请输入计划名称" clearable></el-input>
        </el-form-item>

        <el-form-item label="计划人群：" prop="definitionUid">
          <el-table class="inputcolumn" :data="customerGroup" style="width: 350px;margin:20px 0">
            <el-table-column prop="groupName" label="人群名称">
              <template slot-scope="scope">
                <span>
                  {{ scope.row.groupName }}
                </span>
                <el-tooltip :content="scope.row.groupDesc" placement="top" effect="light">
                  <i class="el-icon-question" style="margin-top: 10px; margin-left: 10px">
                  </i>
                </el-tooltip>
              </template>

            </el-table-column>

            <el-table-column align="center" prop="groupNumber" label="人群数量">
            </el-table-column>
          </el-table>
          <p class="descText">每次推送人数建议少于10万，否则容易出现延时的情况</p>
        </el-form-item>

        <el-form-item label="计划方式：" prop="operationMode" v-if="updateStatus == 'add' ">
          <el-radio-group v-model="form.operationMode" @change="modeChange(form)">
            <el-row>
              <el-col :span="24" style="margin-top: 12px;">
                <el-radio label="0">自动长期计划</el-radio>
                <div style="margin-left: 23px;">
                  <p class="descText" style="margin-top: 20px;">人群中如有满足条件的新增客户，新增的客户会自动收到营销通知</p>
                  <div v-if="form.operationMode == 0" style="margin-top: 20px;">
                    <span class="titleText">计划执行时间：</span>
                    <el-date-picker v-model="form.operationBeginTime" type="date" placeholder="选择日期"
                      style="margin-left: 20px;" />
                    <span class="titleText" style="margin-left: 20px;">至</span>
                    <el-date-picker v-model="form.operationEndTime" type="date" placeholder="选择日期"
                      style="margin-left: 20px;" />
                  </div>
                </div>
              </el-col>
            </el-row>
            <el-row style="margin-top: 20px;">
              <el-col :span="24">
                <el-radio label="1">手动定时计划</el-radio>
                <div style="margin-left: 23px;">
                  <p class="descText" style="margin-top: 20px;">在指定时间向计划人群发送营销通知</p>
                  <div v-if="form.operationMode == 1" style="margin-top: 20px;">
                    <span class="titleText">计划执行时间：</span>
                    <el-radio-group v-model="form.executeType" style="margin-top: 15px;">
                      <el-row style="margin-top: 17px;">
                        <el-col :span="24">
                          <el-radio label="0">立即执行</el-radio>
                        </el-col>
                      </el-row>
                      <el-row style="margin-top: 20px;">
                        <el-col :span="24">
                          <el-radio label="1">定时执行</el-radio>
                          <el-date-picker v-if="form.executeType == 0 " disabled v-model="form.operationBeginTime"
                            type="datetime" placeholder="选择日期" />
                          <el-date-picker v-if="form.executeType == 1" v-model="form.operationBeginTime" type="datetime"
                            placeholder="选择日期" />
                        </el-col>
                      </el-row>
                    </el-radio-group>

                  </div>
                </div>
              </el-col>
            </el-row>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="计划方式：" prop="operationMode" v-if="updateStatus == 'edit' ">
          <el-radio-group v-model="form.operationMode" @change="modeChange(form)" >
            <el-row>
              <el-col :span="24" style="margin-top: 12px;">
                <el-radio label="0" disabled>自动长期计划</el-radio>
                <div style="margin-left: 23px;">
                  <p class="descText" style="margin-top: 20px;">人群中如有满足条件的新增客户，新增的客户会自动收到营销通知</p>
                  <div v-if="form.operationMode == 0" style="margin-top: 20px;">
                    <span class="titleText">计划执行时间：</span>
                    <el-date-picker v-model="form.operationBeginTime" type="date" disabled placeholder="选择日期"
                                    style="margin-left: 20px;" />
                    <span class="titleText" style="margin-left: 20px;">至</span>
                    <el-date-picker v-model="form.operationEndTime" type="date" disabled placeholder="选择日期"
                                    style="margin-left: 20px;" />
                  </div>
                </div>
              </el-col>
            </el-row>
            <el-row style="margin-top: 20px;">
              <el-col :span="24">
                <el-radio label="1" disabled>手动定时计划</el-radio>
                <div style="margin-left: 23px;">
                  <p class="descText" style="margin-top: 20px;">在指定时间向计划人群发送营销通知</p>
                  <div v-if="form.operationMode == 1" style="margin-top: 20px;">
                    <span class="titleText">计划执行时间：</span>
                    <el-radio-group v-model="form.executeType" style="margin-top: 15px;">
                      <el-row style="margin-top: 17px;">
                        <el-col :span="24">
                          <el-radio label="0">立即执行</el-radio>
                        </el-col>
                      </el-row>
                      <el-row style="margin-top: 20px;">
                        <el-col :span="24">
                          <el-radio label="1" disabled>定时执行</el-radio>
                          <el-date-picker v-if="form.executeType == 0 " disabled v-model="form.operationBeginTime"
                                          type="datetime" placeholder="选择日期" />
                          <el-date-picker v-if="form.executeType == 1" disabled v-model="form.operationBeginTime" type="datetime"
                                          placeholder="选择日期" />
                        </el-col>
                      </el-row>
                    </el-radio-group>

                  </div>
                </div>
              </el-col>
            </el-row>
          </el-radio-group>
        </el-form-item>



        <div class="div-title">
          <span>权益礼包</span>
        </div>
        <el-form-item label="优惠券配置：">
          <el-checkbox v-model="form.customerOperationPrivilegeVoList[0].isGiveCoupon">发放优惠券</el-checkbox>
          <div class="couponGift" v-if="form.customerOperationPrivilegeVoList[0].isGiveCoupon == true">
            <a class="selectgift" @click="addcoupon">选择优惠券</a>
            <selCoupon v-if="openC" @toCloseBox2="toCloseBox2" @multipleSelection2="multipleSelection2" :flag="openC"
              ref="selTable2">
            </selCoupon>
            <el-table class="inputcolumn" v-if="infoList2 && infoList2.length > 0" :data="infoList2"
              style="width: 350px;margin:20px 0">
              <el-table-column prop="couponTypeName" label="优惠券名称"></el-table-column>
              <el-table-column align="center" prop="stock" label="库存（张）">
              </el-table-column>
              <el-table-column align="center" prop="couponNumber" label="赠送数">
                <template slot-scope="scope">
                  <el-input size="small" onkeyup="value=value.replace(/[^\d]/g,'')"
                    @input="getCouponNumber(scope.row.stock,scope.row.couponNumber,scope.$index)"
                    v-model="scope.row.couponNumber"></el-input>
                </template>
              </el-table-column>
              <el-table-column align="center" prop="receiveNumber" label="操作">
                <template slot-scope="scope">
                  <el-button size="mini" @click="handleDeleteser2(scope.$index, scope.row)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-form-item>

        <div class="div-title">
          <span>通知配置</span>
        </div>
        <el-form-item label="通知渠道：" prop="notificationChannelArr">
          <div style="width: 1100px;">
            <el-checkbox-group v-model="notificationChannelArr"
              @change="notificationChannelChange(notificationChannelArr)">
<!--              <div class="channelClass">-->
<!--                <el-checkbox label="0">公众号图文消息</el-checkbox>-->
<!--                <p class="descText" style="margin-top: 20px;">图文消息只对有互动行为的粉丝生效，无举报风险</p>-->
<!--                <div class="channelConten">-->
<!--                  <div>-->
<!--                    <p class="titleText">未绑定认证的公众号，无法推送消息</p>-->
<!--                    <p style="font-size: 14px;color: #155bd4;"><a @click="bindAll">去绑定</a></p>-->
<!--                  </div>-->
<!--                </div>-->
<!--              </div>-->
<!--              <div class="channelClass">-->
<!--                <el-checkbox label="1">短信通知</el-checkbox>-->
<!--                <p class="descText" style="margin-top: 20px;">扣除店铺短信条数，为了发送成功，请确保在消息推送中设置了自定义签名</p>-->
<!--                <div class="channelConten">-->
<!--                  <div>-->
<!--                    <div class="descIcon">+</div>-->
<!--                    <p class="titleText">配置短信通知</p>-->
<!--                  </div>-->
<!--                </div>-->
<!--              </div>-->

<!--              <div class="channelClass">-->
<!--                <el-checkbox label="2">微信模板消息</el-checkbox>-->
<!--                <p class="descText" style="margin-top: 20px;">根据《微信公众平台运营规范》，频繁发送营销类模板消息存在被封禁的风险</p>-->
<!--                <div class="channelConten">-->
<!--                  <div>-->
<!--                    <p class="titleText">未绑定认证服务号，无法推送消息</p>-->
<!--                    <p style="font-size: 14px;color: #155bd4;"><a @click="bindAll">去绑定</a></p>-->
<!--                  </div>-->
<!--                </div>-->
<!--              </div>-->
              <div class="channelClass">
                <el-checkbox label="3">小程序订阅消息</el-checkbox>
                <p class="descText" style="margin-top: 20px;">用户需按次订阅，订阅后才可发送消息，详情查看《小程序模板消息能力调整通知》</p>
                <div class="channelConten">
                  <div>
                    <p class="titleText">未绑定微信小程序，无法推送消息</p>
                    <p style="font-size: 14px;color: #155bd4;"><a @click="bindAll">去绑定</a></p>
                  </div>
                </div>
              </div>
            </el-checkbox-group>
          </div>
        </el-form-item>

        <el-form-item label="通知规则：" prop="notificationRuleType">
          <el-radio-group v-model="form.notificationRuleType">
            <el-row>
              <el-col :span="24" style="margin-top: 12px;">
                <el-radio label="0">仅通知一个渠道</el-radio>
                <div style="margin-left: 23px;">
                  <p class="descText" style="margin-top: 20px;">同一个客户仅通知优先级最高的渠道，置顶可更改排序</p>
                  <div v-if="form.notificationRuleType == 0" style="margin-top: 20px;">
                    <el-table class="inputcolumn" :data="notificationRule" style="width: 350px;margin:20px 0">
                      <el-table-column label="通知优先级">
                        <template slot-scope="scope">
                          {{scope.$index+1}}
                        </template>
                      </el-table-column>

                      <el-table-column prop="ruleName" label="通知渠道">
                      </el-table-column>
                      <el-table-column label="操作">
                        <template slot-scope="scope">
                          <el-button size="mini" type="text" @click="topClick(scope.row)">置顶
                          </el-button>
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>
                </div>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="24" style="margin-top: 12px;">
                <el-radio label="1">所有渠道同步通知</el-radio>
                <div style="margin-left: 23px;">
                  <p class="descText" style="margin-top: 20px;">同一个客户每个渠道通知一遍，有可能会骚扰客户，请慎用</p>
                </div>
              </el-col>
            </el-row>
          </el-radio-group>
        </el-form-item>

        <div class="div-title" v-if="form.operationMode == 0">
          <span>时间设置</span>
        </div>
        <el-form-item label="发放权益、通知时间：每天" prop="notificationTime" v-if="form.operationMode == 0">
          <el-select v-model="form.notificationTime" style="width: 100px" placeholder="请选择">
              <el-option
                v-for="item in notificationTimeOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
          </el-select>
          开始发送通知
          <p class="descText" style="margin-top: 20px;">为避免骚扰用户，限制通知时间范围 08:00-19:00</p>
        </el-form-item>
<!--        <div class="div-title">-->
<!--          <span>计划异常提醒</span>-->
<!--        </div>-->
<!--        <p class="titleText" style="margin-left: 120px;margin-top: 30px;">在计划即将到期、权益库存不足和短信条数不足的情况下提醒</p>-->
<!--          <el-form-item label="提醒方式：" prop="abnormalRemind" style="margin-top: 30px;" >-->
<!--              <el-checkbox-group v-model="abnormalRemind" @change="remindChange">-->
<!--                <el-row>-->
<!--                  <el-col :span="24" >-->
<!--                    <el-checkbox label="0">通过App推送通知我</el-checkbox>-->
<!--                  </el-col>-->
<!--                </el-row>-->
<!--                <el-row>-->
<!--                  <el-col :span="24">-->
<!--                    <el-checkbox label="1">通过短信通知我</el-checkbox>-->
<!--                  </el-col>-->
<!--                </el-row>-->
<!--                <el-row>-->
<!--                  <el-col :span="24" style="margin-left: -7%">-->
<!--                        <span class="titleText" style="margin-left: 120px;">接收通知的手机号：</span>-->
<!--                        <el-input v-model="form.remindPhone" v-if="remindPhoneInput == true" style="width: 200px;"></el-input>-->
<!--                        <el-input v-model="form.remindPhone" v-if="remindPhoneInput == false" disabled style="width: 200px;"></el-input>-->
<!--                        <span class="descText" style="margin-top: 20px;">请注意，短信通知将扣除店铺短信的条数</span>-->
<!--                  </el-col>-->
<!--                </el-row>-->
<!--                <el-row style="height: 80px;">-->
<!--                  </el-row>-->
<!--              </el-checkbox-group>-->
<!--          </el-form-item>-->
        <div class="dw" align="center">
           <el-button @click="cancel" style="margin-top: 10px;margin-left: -10%;">返回</el-button>
          <el-button type="primary" @click="submitForm" style="margin-top: 10px;">保存</el-button>
        </div>
      </el-form>
    </div>
  </div>

</template>

<script>
  import {
    addCustomerOperation,
    getCustomerOperation
  } from "@/api/customer/CustomerOperation";
  import {
    getGroupInfoById
  } from "@/api/customer/CustomerGroup";
  import selCoupon from "@/components/Activity/selCoupon";
  export default {
    components: {
      selCoupon
    },
    data() {
      return {
        // 弹出层标题
        title: "",
        //查看详细标题
        viewTitle: "",
        // 是否显示弹出层
        open: false,
        //是否显示查看详细弹出层
        viewOpen: false,
        //查看详细数据
        showData: [],
        //人群名称简介
        definitionInfo: [],
        //运营名称
        groupName: "",
        //人群对象
        customerGroup: [],
        infoList2: [],
        notificationChannelArr: [],
        abnormalRemind:[],
        remindPhoneInput:false,
        notificationRule: [],
        operationUid:"",
        updateStatus:"add",
        notificationTimeOptions:[{
          value: '8:00',
          label: '8:00'
        }, {
          value: '9:00',
          label: '9:00'
        }, {
          value: '10:00',
          label: '10:00'
        }, {
          value: '11:00',
          label: '11:00'
        }, {
          value: '12:00',
          label: '12:00'
        }, {
          value: '13:00',
          label: '13:00'
        }, {
          value: '14:00',
          label: '14:00'
        }, {
          value: '15:00',
          label: '15:00'
        }, {
          value: '16:00',
          label: '16:00'
        }, {
          value: '17:00',
          label: '17:00'
        }, {
          value: '18:00',
          label: '18:00'
        }, {
          value: '19:00',
          label: '19:00'
        }],
        openC: false,
        //人群id
        groupUid: null,
        // 表单参数
        form: {
          notificationChannelArr:[],
          customerOperationPrivilegeVoList:[
            {
              isGiveCoupon:null,
              customerOperationPrivilegeGivesvo:[]
            }
          ]
        },
        // 表单校验
        rules: {
          operationName: [{
            required: true,
            message: "计划名称不能为空",
            trigger: "blur"
          }],
          operationMode: [{
            required: true,
            message: "计划方式不能为空",
            trigger: "blur"
          }],
          notificationRuleType: [{
            required: true,
            message: "通知规则不能为空",
            trigger: "blur"
          }],
        }
      };
    },
    created() {
      let $this = this;
      const operationUid = $this.$route.params && $this.$route.params.operationUid;
      this.operationUid = operationUid;
      console.log(this.operationUid);
      if(operationUid == null){
        const groupUid = $this.$route.params && $this.$route.params.groupUid;
        this.groupUid = groupUid;
        if (groupUid != null) {
          var date = new Date();
          var month = date.getMonth() + 1;
          var strDate = date.getDate();
          if (month >= 1 && month <= 9) {
            month = "0" + month;
          }
          if (strDate >= 0 && strDate <= 9) {
            strDate = "0" + strDate;
          }
          var currentDate = date.getFullYear() + month + strDate + date.getHours() + date.getMinutes() + date
            .getSeconds();
          this.groupName = "人群运营" + currentDate;
        }
        getGroupInfoById(groupUid).then(response => {
          console.log(response.data)
          this.form.definitionUid = response.data.groupUid;
          this.form.definitionName = response.data.groupName;
          this.customerGroup.push(response.data);
        });
      }else {
        this.updateStatus = 'edit';
        getCustomerOperation(operationUid).then(response => {
          this.form = response.data;
          console.log(response.data)
          getGroupInfoById(response.data.definitionUid).then(response => {
            this.form.definitionUid = response.data.groupUid;
            this.form.definitionName = response.data.groupName;
            this.customerGroup.push(response.data);
          });
          response.data.customerOperationPrivilegeVoList[0].customerOperationPrivilegeGivesvo.forEach((item) => {
            let coupon = new Object();
            coupon.couponTypeName = item.couponName;
            coupon.stock = item.couponNums;
            coupon.couponNumber = item.giveNumber;
            this.infoList2.push(coupon);
          })
          let notificationChannelArr =  response.data.notificationChannel.split("/");
          notificationChannelArr.pop();
          this.notificationChannelArr  =notificationChannelArr;
          console.log(this.notificationChannelArr)
          this.notificationChannelArr.forEach(report => {
            let rule = new Object();
            if (report == 0) {
              rule.ruleName = "公众号";
              this.notificationRule.push(rule);
            }
            if (report == 1) {
              rule.ruleName = "短信";
              this.notificationRule.push(rule);
            }
            if (report == 2) {
              rule.ruleName = "微信模板";
              this.notificationRule.push(rule);
            }
            if (report == 3) {
              rule.ruleName = "小程序";
              this.notificationRule.push(rule);
            }
            rule.ruleValue = report;
          })
          if(response.data.abnormalRemind != '2'){
            this.abnormalRemind.push(response.data.abnormalRemind)
            if(response.data.abnormalRemind != '1'){
              this.remindPhoneInput = true;
            }
          }else{
            this.abnormalRemind.push('0');
            this.abnormalRemind.push('1');
            this.remindPhoneInput = true;
          }
        });
      }
    },
    methods: {
      remindChange(){
        this.remindPhoneInput = false;
        this.abnormalRemind.forEach((item) => {
          if(item == '1'){
            this.remindPhoneInput = true;
            this.form.abnormalRemind = '1';
          }else{
            this.form.abnormalRemind = '0';
          }
        })
        if(this.abnormalRemind.length == 2){
          this.form.abnormalRemind = '2';
        }
      },
      topClick(row) {
        this.notificationRule.forEach((item, index) => {
          if (item.ruleValue == row.ruleValue) {
            this.notificationRule.splice(index, 1);
            this.notificationRule.unshift(row)
          }
        })
      },
      notificationChannelChange(notificationChannelArr) {
        this.notificationRule = [];
        this.form.notificationChannelArr = [];
        notificationChannelArr.forEach(report => {
          this.form.notificationChannelArr.push(report);
          let rule = new Object();
          if (report == 0) {
            rule.ruleName = "公众号";
            this.notificationRule.push(rule);
          }
          if (report == 1) {
            rule.ruleName = "短信";
            this.notificationRule.push(rule);
          }
          if (report == 2) {
            rule.ruleName = "微信模板";
            this.notificationRule.push(rule);
          }
          if (report == 3) {
            rule.ruleName = "小程序";
            this.notificationRule.push(rule);
          }
          rule.ruleValue = report;
        })

      },
      bindAll() {

      },
      getCouponNumber(k, i, idx) {
        i = parseInt(i)
        k = parseInt(k)
        if (i > k) {
          this.infoList2[idx].couponNumber = 1
          this.msgError("赠送数不能大于优惠券总数");
        }
      },
      toCloseBox2() {
        this.openC = false;
      },
      multipleSelection2(data) {
        this.openC = false
        this.infoList2 = data;
        this.infoList2.forEach(i => {
          this.$set(i, 'couponNumber', 1)
        })
      },
      handleDeleteser2(val, row) {
        // 模态框删除按钮
        this.$confirm("是否确认删除本条数据?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "info",
        }).then(() => {
          this.infoList2.splice(val, 1);
        });
      },
      addcoupon() {
        this.$forceUpdate()
        this.openC = true;
        this.$nextTick(() => {
          this.$refs["selTable2"].greet2(this.infoList2);
        });
      },
      modeChange(value, form) {
        if (value.operationBeginTime != null) {
          value.operationBeginTime = null;
          value.operationEndTime = null;
        }
        // console.log(value);
        // form.operationBeginTime="";
      },

      // 表单重置
      reset() {
        this.form = {
          operationUid: null,
          customerUid: null,
          platformId: null,
          operationType: null,
          definitionUid: null,
          operationTypeValue: null,
          operationName: null,
          operationMode: null,
          executeType: null,
          operationBeginTime: null,
          operationEndTime: null,
          operationTimeType: null,
          notificationChannel: null,
          notificationRuleType: null,
          notificationRule: null,
          notificationTime: null,
          abnormalRemind: [],
          remindPhone: null,
          createTime: null,
          updateTime: null,
          createUser: null,
          updateUser: null,
          dataStatus: "0",
          createName: null,
          updateName: null
        };
        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.operationUid)
        this.single = selection.length !== 1
        this.multiple = !selection.length
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.reset();
        this.open = true;
        this.title = "添加客户运营";
      },
      /** 查看详情按钮操作 **/
      handleShowDetail(row) {
        this.viewOpen = true;
        this.viewTitle = "查看客户运营";
        this.showData = [];
        this.columns.forEach(item => {
          this.showData.push({
            label: item.label,
            value: row[item.dataIndex]
          })
        })
      },
      handCloseDetail() {
        this.viewOpen = false
        this.showData = []
      },
      // 新建运营
      saveOperation() {

      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.reset();
        const operationUid = row.operationUid || this.ids
        getCustomerOperation(operationUid).then(response => {
          this.form = response.data;
          this.open = true;
          this.title = "修改客户运营";
        });
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          this.form.operationType = '0'
          if(this.form.abnormalRemind == '0'){
            this.form.remindPhone = null;
          }
          if(this.form.notificationRuleType == '0'){
            if(this.notificationChannelArr[0] != null){
              this.form.notificationRule = this.notificationChannelArr[0];
            }
          }
          console.log(this.infoList2)
          this.infoList2.forEach(item => {
            let giveCoupon = new Object();
            giveCoupon.giveUid = item.couponUid;
            giveCoupon.couponName = item.couponTypeName;
            giveCoupon.couponDesc = item.couponDesc;
            giveCoupon.couponNums = item.couponNums;
            giveCoupon.giveNumber = item.couponNumber;
            this.form.customerOperationPrivilegeVoList[0].customerOperationPrivilegeGivesvo.push(giveCoupon);
            this.form.customerOperationPrivilegeVoList[0].couponNumber = item.couponNumber;
          })
          if(this.form.operationBeginTime != null){
            let beginDate = this.forDate(this.form.operationBeginTime);
            this.form.operationBeginTime = beginDate;
          }
          if(this.form.operationEndTime != null){
            let endDate = this.forDate(this.form.operationEndTime);
            this.form.operationEndTime = endDate;
          }
          if(this.form.customerOperationPrivilegeVoList[0].isGiveCoupon == null){
            this.form.customerOperationPrivilegeVoList[0].isGiveCoupon = false;
          }
          if (valid) {
            if (this.form.operationUid != null) {
              updateCustomerOperation(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open = false;
                this.colseLevel();
              });
            } else {
              console.log("添加运营",this.form);
              addCustomerOperation(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open = false;
                this.colseLevel();
              });
            }
          }
        });
      },
      forDate(date){
        if(date instanceof Date){
          var y = date.getFullYear();
          var m = date.getMonth() + 1;
          m = m < 10 ? '0' + m : m;
          var d = date.getDate();
          d = d < 10 ? ('0' + d) : d;
          return y + '-' + m + '-' + d;
        }
      },
      cancel(){
        this.colseLevel();
      },
      colseLevel() {
        this.$store.dispatch("tagsView/delView", this.$route);
        this.$router.push({
          path: "/customer/CustomerOperation",
          query: {
            t: Date.now()
          }
        });
      }
    }
  };
</script>

<style scoped>
  .block {
    padding: 30px 0;
    text-align: center;
    display: inline-block;
    vertical-align: top;
  }

  .app-container {
    background-color: #F7F8FA;
    padding: 20px;
  }

  .font-normal1 {
    font-size: 12px;
    color: #84868a;
    margin-top: -5px;
  }

  .font-normal {
    font-size: 12px;
    color: #84868a;
    margin-top: -6px;
  }

  .div-title {
    background-color: rgb(242, 246, 252);
    margin: 15px;
    padding: 10px 10px 10px 10px;
  }

  .dw {
    border: 1px;
    position: fixed;
    bottom: 0px;
    background-color: #f2f6fc;
    width: 100%;
    height: 55px;
  }

  .descText {
    color: var(--theme-stroke-3, #969799);
    line-height: 14px;
    font-size: 12px;
    margin-top: 10px;
    margin-bottom: 0;
  }

  .titleText {
    line-height: 14px;
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 0;
  }

  .channelClass {
    border: 1px solid #e5e5e5;
    padding: 20px;
    width: 450px;
    height: 300px;
    float: left;
    margin-left: 20px;
    margin-top: 20px;
  }

  .channelConten {
    border: 1px dotted #e5e5e5;
    padding: 25px 10px;
    height: 170px;
    text-align: center;
    min-height: 110px;
    box-sizing: border-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 10px;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .descIcon {
    font-size: 40px;
    line-height: 40px;
    font-weight: 200;
    color: #155bd4;
  }
</style>
